import React, { useEffect, useState } from "react";
import { Card } from "antd";
import { data } from "../data.json";

export default function () {
  const [list, setList] = useState([]);
  const { Meta } = Card;
  useEffect(() => {
    setList(data);
    console.log(list);
  });

  return (
    <Card
      hoverable="true"
      style={{
        width: 200,
        height: 320,
        backgroundColor: "rgba(241, 245, 249, 0.5)",
        margin: "6px 6px",
      }}
      cover={
        <img
          alt="example"
          src="https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png"
        />
      }
      bodyStyle={{
        padding: "10px 20px",
      }}
    >
      <Meta title="Europe Street beat" description="www.instagram.com" />
    </Card>
  );
}
